<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>添加产品</title>
    <link rel="stylesheet" href="/static/lib/layuiadmin/plugins/layui/css/layui.css" media="all" />
    <link rel="stylesheet" href="/static/lib/layuiadmin/css/global.css" media="all">
    <link rel="stylesheet" href="/static/lib/layuiadmin/plugins/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="/static/lib/layuiadmin/css/table.css" />
</head>

<body>
<div class="admin-main">

    <div style="margin: 15px;">
        <form class="layui-form" method="post" action="/admin/product/update">
            <div class="layui-form-item">
                <label class="layui-form-label">产品名字</label>
                <div class="layui-input-block">
                    <input type="text" name="name" value="<{$product.name}>" required lay-verify="required" placeholder="请输入产品名字" autocomplete="off" class="layui-input">
                </div>
            </div>


            <div class="layui-form-item">
                <label class="layui-form-label">产品描述</label>
                <div class="layui-input-block">
                    <input type="text" name="desc" value="<{$product.desc}>" required lay-verify="required" placeholder="请输入产品描述" autocomplete="off" class="layui-input">
                </div>
            </div>



            <div class="layui-form-item">
                <label class="layui-form-label">封面</label>
                <div class="layui-input-block">
                    <img src="<{$product.cover}>" style="width:200px;height:200px;" id="cover-show"/>
                    <div style="color:red;">建议大小：340*250</div>
                    <div style="margin-top: 10px;"><input type="file" name="file" class="layui-upload-file"></div>
                    <input type="hidden" value="<{$product.cover}>" id="cover"  name="cover"/>
                </div>

            </div>


            <div class="layui-form-item">
                <label class="layui-form-label">系统分类</label>
                <div class="layui-input-block">
                    <select name="sys_cat" lay-filter="" >
                        <option value="0">未分类</option>
                        <{volist name="sysCat" id="item" }>
                        <option value="<{$item.id}>" <{if condition="($item.id eq $product.sys_cat)"}>selected<{/if}>  ><{$item.name}></option>
                        <{if condition="!empty($item['sub'])"}>
                        <{volist name="item.sub" id="v" }>
                        <option value="<{$v.id}>" <{if condition="($v.id eq $product.sys_cat)"}>selected<{/if}> >|————<{$v.name}></option>
                        <{/volist}>
                        <{/if}>
                        <{/volist}>
                    </select>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">功能分类</label>
                <div class="layui-input-block">
                    <select name="fun_cat" lay-filter="addFunCat" id="addFunCat" >
                        <option data-text="未分类" value="0">未分类</option>
                        <{volist name="funCat" id="item" }>
                        <option data-text="<{$item.name}>" value="<{$item.id}>" <{if condition="($item.id eq $product.fun_cat)"}>selected<{/if}>  ><{$item.name}></option>
                        <{if condition="!empty($item['sub'])"}>
                        <{volist name="item.sub" id="v" }>
                        <option data-text="<{$v.name}>" value="<{$v.id}>" <{if condition="($v.id eq $product.fun_cat)"}>selected<{/if}> >|————<{$v.name}></option>
                        <{/volist}>
                        <{/if}>
                        <{/volist}>
                    </select>
                </div>
            </div>

            <div class="layui-form-item">
                <label></label>
                <div class="layui-input-block" id="funList">
                    <{volist name="productFunCat" id="item"}>
                    <{if condition="(isset($cats[$item['funcatid']]))"}>
                    <span class="layui-btn layui-btn-primary cancel" data-index="<{$item.funcatid}>" style="margin-top:10px;"><{$cats[$item.funcatid]['name']}></span>
                    <{/if}>
                    <{/volist}>
                </div>
                <div id="funValueList">
                    <{volist name="productFunCat" id="item"}>
                    <{if condition="(isset($cats[$item['funcatid']]))"}>
                    <input type='hidden' value='<{$item.funcatid}>' name='funList[]' id='cancel-<{$item.funcatid}>' />
                    <{/if}>
                    <{/volist}>
                </div>
            </div>

            <input type="hidden" value="<{$product.id}>" name="id" />

            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button lay-filter="add" lay-submit class="layui-btn">提交</button><a href="/admin/product/index" class="layui-btn layui-btn-danger">返回</a>
                </div>
            </div>
        </form>
    </div>

</div>
<script type="text/javascript" src="/static/lib/layuiadmin/plugins/layui/layui.js"></script>


<script type="text/javascript">
    layui.use('form', function(){
        var form = layui.form();
    });
    layui.use(["layer","upload",'form'],function(){
        var form = layui.form();
        var $ = layui.jquery;
        layui.upload({
            url: '/admin/upload/upload'
            ,success: function(res){
                console.log(res); //上传成功返回值，必须为json格式
                if(1 == res.code){
                    $("#cover-show").attr("src",res.data.src);
                    $("#cover").val(res.data.src);
                }else{
                    layer.msg(res.msg);
                }
            }
        });

       form.on("select(addFunCat)",function(data){
           var $dom = $(data.elem).find("option:selected");
           var text = $dom.data('text');
           var value = $dom.val();

           $('#funList').append('<span class="layui-btn layui-btn-primary cancel" data-index="'+value+'" style="margin-top:10px;">'+text+'</span>');
           $("#funValueList").append("<input type='hidden' value='"+value+"' name='funList[]' id='cancel-"+value+"' />");
       });

        $("#funList").delegate('.cancel','click',function(){
            var index = $(this).data('index');
            $(this).remove();
            $("#cancel-"+index).remove();

        });
    });

</script>

</body>

</html>
